@import '@/styles/common.less';

//暗色颜色
.dark_box{
  background: #171a1f;
  //多集群
  .cancel_btn{
    color: #fff !important;
  }
  .munlti_cluster_index{
    background: none !important;
    .title{
      color: #fff !important;
    }
    .num{
      color: #fff !important;
    }
    .host_cluster{
      background: #2a2d34ff !important;
      border: none !important;
      .host_cluster_left_name{
        color: #fff !important;
      }
      .host_cluster_right_text{
        color: #fff !important;
      }
    }
    .host_cluster_table{
      background: #2a2d34ff !important;
      .table_label_key{
        background: #234c9e !important;
      }
      .table_label_value{
        background: #444 !important;
      }
    }
  }
  .multi_cluster_edit{
    .cluster_edit_info{
      background: #2a2d34ff !important;
    }
    .cluster_config{
      background: #2a2d34ff !important;
      .title{
        color: #fff !important;
      }
    }
    .btns{
      background: #2a2d34ff !important;
      box-shadow: 0px -3px 6px rgba(51, 51, 51, 0.1);
    }
  }
  .cancel_btn{
    color: #fff;
    background: #2a2d34ff;
    border: 1px solid #444444ff;
  }
  .disabled_btn{
    border-color: #424242;
    color: #ffffff40;
    background: #ffffff14;
    box-shadow: none;
  }
  .container_platform_box_cluster_top{
    background: #2a2d34ff;
    .namespace_total{
      background: #2a2d34ff;
    }
    .label{
      color: #fff;
    }
  }
  .container_nav_bar{
    background: @dark-background-color !important;
    box-shadow: @dark-box-shadow !important;
    border-right:1px solid #666666;
    .@{container-prefix}-menu{
      background: @dark-background-color !important;
      color: #fff;
      .@{container-prefix}-menu-item{
        color: #fff;
      }
      .@{container-prefix}-menu-submenu-title{
        color:#fff;
      }
    }
    .collapse_arrow{
      background: @dark-background-color !important;
      color: #fff;
      border-color:#666666; 
    }
  }
  .container_content{
    background: @dark-background-color !important;
    .namespace_total{
      background: @dark-background-color !important;
      box-shadow: inset 0px -1px 0px #666666;
      color:#fff;
      .namespace_bar{
        .label{
          color: #fff;
        }
      }
    }
    .child_content{
      background-color: @dark-box-page-color !important;
      .page_header{
        background-color: @dark-background-color;
       box-shadow: inset 0px -1px 0px #666666;
        color:#fff;
      }
      .@{container-prefix}-breadcrumb{
        background-color: @dark-background-color;
        li{
          // color:#fff;
        }
      }
      .@{container-prefix}-tabs-nav{
        background-color: @dark-background-color;
        box-shadow: @dark-box-shadow;
      }
      .@{container-prefix}-tabs-nav:before{
        border-color: #666666;
      }
      .@{container-prefix}-tabs-tab{
        color:#fff;
      }
      .tab_container{
        background:@dark-background-color;
        .@{container-prefix}-input-outlined{
          background-color: @dark-background-color;
          color: #666666;
          border-color: #666666;
        }
        .@{container-prefix}-input-outlined::placeholder{
          color: #666666;
        }
        .@{container-prefix}-input-search-button{
          color: #666666 !important;
          background-color: @dark-background-color;
          border-color: #666666;
        }

      }
    }
  }
  .tab_table_flex{
    background: @dark-background-color;
    table{
      color:#fff;
      background: @dark-background-color!important;
      .@{container-prefix}-table-thead{
        tr{
          th{
            color:#fff;
            // background: @dark-background-color;
          }
          th::before{
            background-color: @dark-background-color;
          }
          .anticon-filter{
            color: #fff;
          }
          .@{container-prefix}-table-column-sorter{
            color: #fff;
          }
        }
     
      }
    }
  }
  .@{container-prefix}-select {
    .@{container-prefix}-select-selector{
      color: #fff !important;
      background-color: @dark-background-color !important;
    }
    .@{container-prefix}-select-arrow{
      color: #fff !important;
    }
  }
  .@{container-prefix}-pagination-options-quick-jumper input{
    color: #fff !important;
    background-color: @dark-background-color !important;
    border: 1px solid #666666;
  }
  .page .@{container-prefix}-select:hover .@{container-prefix}-select-selector{
    background-color: @dark-background-color !important;
  }
  .@{container-prefix}-select-dropdown{
    .@{container-prefix}-select-item-option-selected{
      background-color: @button-hover-color !important;
    }
    .@{container-prefix}-select-item-option-active{
      background-color: @button-hover-color !important;
    }
    .@{container-prefix}-select-item-option-active:hover{
      background-color: @button-hover-color !important;
    }
  }
  .@{container-prefix}-table-tbody{
    .container-platform-table-row{
      background: @dark-background-color !important;
    }
    tr{
      td{
        background: @dark-background-color !important;
      }
      
    }
  }
  h3{
    color: #fff !important;
  }
  .@{container-prefix}-input{
    border-color: #666666;
  }
  .@{container-prefix}-input-search-button{
    border-color: #666666;
  }
  .primary_btn{
    border:none;
  }
  .@{container-prefix}-modal-title{
    color: #f7f7f7;
  }
  .config_modal_text{
    color: #f7f7f7;
  }
  .config_modal_code{
    background: #2a2d34;
    p{
      color: #f7f7f7;
    }
  }
  .cm-line{
    span{
      color: #f7f7f7 !important;
    }
  }

  .@{container-prefix}-pagination-prev{
    background: @dark-background-color;
    border: 1px solid #666666;
  }
  .@{container-prefix}-pagination-prev:hover{
    button{
      background: @button-hover-color !important;
      color: #fff; 
    }
  }
  .@{container-prefix}-pagination-disabled:hover{
    button{
      background: @dark-background-color !important;
    }
  }
  .@{container-prefix}-pagination-item{
    background: @dark-background-color;
    border: 1px solid #666666;
    a:hover{
      color: #fff !important;
    }
  }
  .@{container-prefix}-pagination-item:hover{
    background: @button-hover-color !important;
    color: #fff;
    button{
      background: @button-hover-color !important;
      color: #fff;
    }
  }
  .@{container-prefix}-pagination-next{
    background-color: @dark-background-color;
    border: 1px solid #666666;
  }
  .@{container-prefix}-pagination-next:hover{
    background: @button-hover-color !important;
    color: #fff;
    button{
      background: @button-hover-color !important;
    }
  }
  .@{container-prefix}-collapse{
    background-color: #171a1f;
  }
  .@{container-prefix}-collapse-header{
    background-color: @dark-background-color;
  }
  .cancel_btn{
    color: #fff;
    background: #2a2d34ff;
    border: 1px solid #444444ff;
  }
  .@{container-prefix}-progress-text{
    color: #fff !important;
  }

  .@{container-prefix}-tabs-nav{
    background-color: @dark-background-color;
  }
  
  /**code_mirror**/
  .code_mirror_box{
    border: 1px solid #444444ff;
    background: #171a1fff !important;
    .cm-editor{
      .cm-scroller{
       .cm-gutters{
         background-color: #171a1fff !important;
       }
       .cm-gutterElement,.cm-gutter{
         color: #09aa71;
         font-size: 16px;
         line-height: 22px;
       }
       .cm-activeLineGutter{
         background-color: #171a1fff !important;
       }
       .cm-line{
         color: #fff;
         font-size: 16px;
         line-height: 22px;
       }
       .ͼl{
         color: #fff;
       }
      }
     }
  }
  .events_form{
    background-color: #2a2d34ff !important;
  }
  .event_timeLine{
    background-color: #2a2d34ff !important;
    .time_info{
      .time_info_item{
        span:last-child{
          color: #fff !important;
        }
      }
    }
  }
  //菜单栏颜色
  .@{container-prefix}-menu-item a {
    color: #89939b;
  }
  .@{container-prefix}-menu-item-selected{
    color: @a-link-color !important;
    background-color: #cfe7ff !important;
    color: #356ac4 !important;
    a{
      color:#356ac4 !important;
    }
  }
  .@{container-prefix}-menu-submenu-selected{
    .@{container-prefix}-menu-submenu-title{
      color: #fff !important;
    }
    .@{container-prefix}-menu-submenu-title:active{
      background-color: #346ac4 !important;
      color: #f7f7f7 !important;
    }
  }
  .@{container-prefix}-menu-item a::before {
    color: #fff !important;
  }
  .@{container-prefix}-menu-submenu-title >.@{container-prefix}-menu-title-content {
    color: #89939b !important;
  }
  .overview_card_selected_cpu_color {
    background-color: #89939b !important;
    color: #fff !important;
  }
  .overview_flex_resource_left_progress {
    background-color: rgba(137, 147, 155, 0.10) !important;
    color: #fff !important;
  }
  .ant-table-thead > tr > th {
    color: white; /* 设置表头文字颜色为白色 */
    background-color: #171a1f; /* 设置表头背景色为 Ant Design 的默认主色 */
  }
  .detail_card .detail_info_box .annotation .key_value .label_item .@{container-prefix}-tag {
    color: white !important; /* 将标签文字颜色设置为白色 */
  }
  .key_value .label_item .@{container-prefix}-tag {
      color: white !important; /* 将标签文字颜色设置为白色 */
  }
  .helm_uplevel_title {
    background-color: #2a2d34;
    border-bottom: 1px solid #666;
  }
  .uplevel_box .level_card {
    background-color: #2a2d34;
  }
  .level_btn_footer {
    background-color: #2a2d34;
  }
  .modal_flex_back .@{container-prefix}-modal-title {
    color: #fff !important;
  }
  .modal_flex_back .modal_flex_back_info .name_group .name {
    color: #fff !important;
  }
  .extend_all .extend_uplevel_title {
    background-color: #2a2d34;
    border-bottom: 1px solid #666;
  }
  .extend_all .extend_uplevel_box .level_card {
    background-color: #2a2d34;
  }
  .extend_all .level_btn_footer {
    background-color: #2a2d34;
  }
  .modal_flex_delete .@{container-prefix}-modal-title {
    color: #fff;
  }
  .content{
    background: #171a1f;
  }
  .user_set_box .user_title {
    color: #fff
  }
  .user_set_box .user_set_content {
    background-color: #2a2d34ff;
  }
  .user_menu {
    background-color: #2a2d34ff;
    border-right: 2px solid #fff;
    z-index: 999;
  }
  .user_set_box .user_set_content .user_info_content {
    border-left: 1px solid #444;
  }
  .monitor_query_container .monitor_query_box_all .monitor_query_box {
    background-color: #2a2d34;
    .monitor_container {
      background-color: #2a2d34;
      .monitor_error_box .info_box p:nth-child(1) {
        color: #fff !important;
      }
    }
    .monitor_query_item .delete svg {
      color: #356ac4 !important;
    }
  }
  .configmap {
      .@{container-prefix}-breadcrumb li {
      color: #fff !important;
    }
  }
}
